<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="referrer" content="no-referrer" />
  <title>{title} - riteme.site</title>
  <link rel="shortcut icon" href="/favicon.png" type="image/png">
  <link rel="stylesheet" href="/styles/material-icons.css">
  <link rel="stylesheet" href="/styles/material.min.css" >
  <link rel="stylesheet" href="/styles/gitment.css">
  <link rel="stylesheet" href="/math-renderer/katex/katex.min.css">
  <link rel="stylesheet" href="/styles/site.css">
  <script src="/scripts/jquery.min.js"></script>
  <script src="/scripts/js-cookie.js"></script>
  <script src="/scripts/quicklink.umd.js"></script>
  <script defer src="/scripts/material.min.js"></script>
  <script src="/scripts/site.js"></script>
  <script src="/scripts/gitment.js"></script>
</head>
<body>
  <div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
    <header class="mdl-layout__header">
      <div class="mdl-layout__header-row">
        <span class="mdl-layout-title">{title}</span>
        <div class="mdl-layout-spacer"></div>
        <div class="mdl-textfield mdl-js-textfield mdl-textfield--expandable mdl-textfield--floating-label mdl-textfield--align-right">
          <label class="mdl-button mdl-js-button mdl-button--icon" for="fixed-header-drawer-exp"><i class="material-icons">search</i></label>
          <div class="mdl-textfield__expandable-holder">
            <form action="/search.html"><input type="text" class="mdl-textfield__input" placeholder="Search Here" name="q" id="fixed-header-drawer-exp" autocomplete="off" required></form>
          </div>
        </div>
      </div>
    </header>
    <div class="mdl-layout__drawer">
      <span class="mdl-layout-title drawer-title">
        <a href="/index.html" style="color: inherit; font-weight: inherit;text-decoration: none;"><img src="/favicon.png" width=32 height=32> riteme.site</a>
      </span>
      <nav class="mdl-navigation">
        <a class="mdl-navigation__link" href="/index.html"><i class="material-icons drawer-icon">home</i> 首页</a>
        <a class="mdl-navigation__link" href="/posts.html"><i class="material-icons drawer-icon">library_books</i> 所有文章</a>
        <a class="mdl-navigation__link" href="/about.html"><i class="material-icons drawer-icon">info</i> 关于</a>
        <a class="mdl-navigation__link" href="/links.html"><i class="material-icons drawer-icon">link</i> 友链</a>
        <a class="mdl-navigation__link" href="/search.html"><i class="material-icons drawer-icon">search</i> 搜索</a>
        <a class="mdl-navigation__link" href="https://github.com/riteme/riteme.github.io"><i class="material-icons drawer-icon">class</i> GitHub 项目</a>
      </nav>
    </div>
    <main class="mdl-layout__content">
      <div class="mdl-grid">
        <div class="mdl-cell main-cell">
          <div class="article main-article" lang="en-US">
            {content}
            <hr/>
            <div id="comments"></div>
            <script type="text/javascript">
              window.addEventListener('load', () => {{ quicklink(); }});
              const gitment = new Gitment({{id: '{page_key}', owner: 'riteme', repo: 'riteme.github.io',
                oauth: {{
                  client_id: 'd4fcffa25858a7a58e1a',
                  client_secret: 'e0c8e08beb95497871f8355416c69390634cec76'
                }},
                perPage: 10,
              }});
              gitment.render('comments');
            </script>
          </div>
        </div>
        <div class="mdl-cell sidebar">
          <div class="article">
            <div class="mdl-card mdl-shadow--2dp sidebar-card">
              <div class="mdl-card__actions sidebar-title">页面信息</div>
              <div class="mdl-card__supporting-text">
                标签: {tags}<br/>
                创建时间: {create}<br/>
                上次修改: {modified}<br/>
                字数统计: {stat}
              </div>
            </div>
            <br/>
            {toc}
            <div class="mdl-card mdl-shadow--2dp sidebar-card">
              <div class="mdl-card__actions sidebar-title">数学公式渲染</div>
              <div class="mdl-card__supporting-text">
                <form name="mathopt">
                  <label class="mdl-radio mdl-js-radio" for="option-1">
                    <input type="radio" id="option-1" class="mdl-radio__button" name="sel" value="mathjax">
                    <span class="mdl-radio__label">MathJax</span>
                  </label><br/>
                  <label class="mdl-radio mdl-js-radio" for="option-2">
                    <input type="radio" id="option-2" class="mdl-radio__button" name="sel" value="katex">
                    <span class="mdl-radio__label">KaTeX</span>
                  </label>
                  <div id="tip-1">
                    <label class="mdl-radio mdl-js-radio" for="option-3">
                      <input type="radio" id="option-3" class="mdl-radio__button" name="sel" value="katex&mathjax">
                      <span class="mdl-radio__label">Mixed</span>
                    </label>
                  </div>
                </form>
                <div id="tip-2">
                  <label class="mdl-checkbox mdl-js-checkbox" for="mathopt-align">
                    <input type="checkbox" id="mathopt-align" class="mdl-checkbox__input">
                    <span class="mdl-checkbox__label">居中显示</span>
                  </label>
                </div>
              </div>
            </div>
            <div class="mdl-tooltip" data-mdl-for="tip-1">先使用 KaTeX 渲染，再使用 MathJax 渲染</div>
            <div class="mdl-tooltip" data-mdl-for="tip-2">该选项目前仅支持 KaTeX 渲染的公式<br/>点击公式可以切换单个公式的对齐方式</div>
            <br/>
            <div class="nano mdl-card mdl-shadow--2dp sidebar-card">
              <div class="mdl-card__actions">
                <div class="nano-shell"><span class="shell-start">$</span> nano <a href="{github_location}" id="nano-link">{mdname}</a></div>
              </div>
            </div>
            <div class="mdl-tooltip" data-mdl-for="nano-link">查看原始 Markdown 文档</div>
          </div>
        </div>
      </div>
      <footer class="mdl-mega-footer">
        <div class="mdl-mega-footer__middle-section">
          <div class="mdl-mega-footer__drop-down-section">
            <input class="mdl-mega-footer__heading-checkbox" type="checkbox" checked>
            <h2 class="mdl-mega-footer__heading">RITEME.SITE</h2><del>一个从不乱说话的博客</del>
          </div>
          <div class="mdl-mega-footer__drop-down-section">
            <input class="mdl-mega-footer__heading-checkbox" type="checkbox" checked>
            <h2 class="mdl-mega-footer__heading">POWERED BY</h2>
            <ul class="mdl-mega-footer__link-list">
              <li><a href="http://pythonhosted.org/Markdown/">Python Markdown</a></li>
              <li><a href="http://getmdl.io/">Material Design Lite</a></li>
              <li><a href="http://www.tipue.com/search/">Tipuesearch</a></li>
              <li><a href="http://www.mathjax.org/">MathJax</a> & <a href="http://khan.github.io/KaTeX/">KaTeX</a></li>
              <li><a href="https://github.com/imsun/gitment">Gitment</a></li>
            </ul>
          </div>
          <div class="mdl-mega-footer__drop-down-section">
            <input class="mdl-mega-footer__heading-checkbox" type="checkbox" checked>
            <h2 class="mdl-mega-footer__heading">友情链接</h2>
            <ul class="mdl-mega-footer__link-list">
              <li><a href="http://ruanx.pw/">ruanxingzhi</a></li>
              <li><a href="https://blog.xehoth.cc/">xehoth</a></li>
              <li><a href="http://hjwjbsr.is-programmer.com/">HJWJBSR</a></li>
              <li><a href="http://www.micdz.cn/">MicDZ</a></li>
              <li><a href="https://cmxrynp.github.io/">CMXRYNP</a></li>
              <li><a href="http://memset0.cn/">memset0</a></li>
            </ul>
          </div>
        </div>
        <div class="mdl-mega-footer__bottom-section">Theme based on <a href="https://getmdl.io/">MDL</a> |
          <a href="http://creativecommons.org/licenses/by-nc-sa/4.0/"><img alt="Creative Commons License" class="cc" src="/assets/cc-by-nc-sa-4.png" /></a> CC BY-NC-SA 4.0
        </div>
      </footer>
    </main>
  </div>
</body>
</html>
